import React from 'react';
import RouterView from '../../router/RouterView';
import { Layout, Menu} from 'antd';
import { useHistory } from 'react-router-dom'
import { SettingOutlined } from '@ant-design/icons'

const { Sider, Content } = Layout;
const { SubMenu } = Menu;
function CustomCenter(props) {
    var {routes}=props;
    var history = useHistory()
    
    var handleClick=({ item, key, keyPath, domEvent })=>{
        history.push(key)
    }
    return (
        <Layout className='customcenter'>
        <Sider>
            <h1>客户管理</h1>
            <Menu
                mode='inline'
                theme="light"
                defaultSelectedKeys={['/index/customcenter/custommanage']}
                style={{ lineHeight: '64px' }}
                onClick={handleClick}
            >
                <Menu.Item key="/index/customcenter/custommanage">客户管理</Menu.Item>
                <SubMenu
                        key="1"
                        title={
                            <span>
                                <SettingOutlined></SettingOutlined>
                                <span>设置</span>
                            </span>
                        }
                        >
                        <Menu.Item key="1">客户信息</Menu.Item>
                        <Menu.Item key="2">客户标签</Menu.Item>
                        <Menu.Item key="3">vip客户设置</Menu.Item>
                        <Menu.Item key="4">黑名单客户</Menu.Item>
                        <Menu.Item key="5">客户保存规则</Menu.Item>
                        <Menu.Item key="6">客户分配规则</Menu.Item>
                    </SubMenu>
            </Menu>
        </Sider>
        <Content>
            {/* 渲染三级路由规则 */}
            <RouterView routes={routes}></RouterView>
        </Content>
</Layout>
    );
}

export default CustomCenter;